<template>
  <div class="clearFiles-content">
    <div class="header" v-if="!showPreviewImg">
      <Navbar :title="'重复文件'" @leftclick="goback"> </Navbar>
      <div class="popoverContent" v-if="!isAllClear">
        <van-popover v-model:show="showPopover" :show-arrow="false" :placement="'bottom-end'" class="clearFilesPopover">
          <div
            v-for="(item, index) in actions"
            :key="index"
            class="popoverItems hoverP"
            :class="{ active: currentType === item.type }"
            @click="selectChange(item)"
          >
            {{ item.text }}
          </div>
          <template #reference>
            <img class="img" src="@/assets/selectType.png" alt="" />
            <span class="text">{{ currentTypeText }}</span>
          </template>
        </van-popover>
      </div>
    </div>
    <div class="content" v-if="!isAllClear">
      <div class="fixHeader">
        <img class="img" src="@/assets/warning.png" alt="" />
        <span class="info"
          >{{ duplicateData.totalCount }}组重复文件，占用空间 {{ convertBytes(duplicateData.totalSize) }}</span
        >
      </div>
      <div class="wrap">
        <van-checkbox-group v-model="checked" v-if="!loading">
          <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
            <van-list
              v-model:loading="loading"
              :finished="finished"
              finished-text="没有更多了"
              :loading-text="'加载中...'"
              @load="loadMoreData"
              :offset="20"
            >
              <div
                class="parentList"
                :class="{
                  active: getActiveStatus(parentItem),
                  empty: parentItem.length < 2,
                }"
                v-for="(parentItem, parentIndex) in duplicateData.fileSetListCopy"
                :key="parentIndex"
              >
                <div class="childList hoverP" v-for="(childItem, childIndex) in parentItem" :key="childIndex">
                  <div class="childListLeft hoverP" @click.stop="selectItem(childItem)">
                    <img class="img-icon" :src="checked.includes(childItem.path) ? activeIcon : inactiveIcon" />
                  </div>
                  <div class="childListRight">
                    <div class="childTop">
                      <div
                        class="childTopLeft hoverP"
                        @click.stop="previewFile(childItem)"
                        :class="{
                          paddingLeftNone: childItem.isImgOrVedio,
                        }"
                      >
                        <!-- 图片视频 -->
                        <div class="img" v-if="childItem.isImgOrVedio">
                          <van-image
                            :src="childItem.url"
                            lazy-load
                            class="picture"
                            width="100%"
                            height="100%"
                            v-if="childItem.fileType === 3"
                          >
                            <template v-slot:error>
                              <img src="@/icons/svg/lietu.png" alt="" />
                            </template>
                          </van-image>
                          <span class="vedio" v-else-if="childItem.fileType === 1">
                            <van-image :src="childItem.url" class="vedioImg" lazy-load width="100%" height="100%">
                              <template v-slot:error>
                                <img src="@/icons/svg/lietu.png" alt="" />
                              </template>
                            </van-image>
                            <img class="playBtn" src="@/icons/svg/maskbofang@2x.png" alt="" />
                          </span>
                        </div>
                        <!-- 其它类型 -->
                        <svg-icon class="svgIcon" :icon-class="childItem.iconClass" v-else />
                      </div>
                      <div class="childTopRight">
                        <p class="name van-ellipsis hoverP" @click.stop="previewFile(childItem)">
                          {{ childItem.name }}
                        </p>
                        <p class="info" @click.stop="selectItem(childItem)">
                          <span class="time">
                            {{ shareDateFormat(childItem.mtime, 0, "YYYY/MM/DD") }}
                            <i class="time">{{ shareDateFormat(childItem.mtime, 0, "HH:mm") }}</i></span
                          >
                          <span class="size">{{ convertBytes(childItem.size) }}</span>
                        </p>
                      </div>
                    </div>
                    <div class="childBottom van-multi-ellipsis--l2" @click.stop="selectItem(childItem)">
                      来自： {{ childItem.displayName }}
                    </div>
                  </div>
                </div>
              </div>
            </van-list>
          </van-pull-refresh>
        </van-checkbox-group>
        <div v-else class="loadingStatus">数据加载中...</div>
      </div>
      <div class="footer">
        <van-button
          type="primary"
          class="footerBtn hoverP"
          :class="{ active: checked.length, disabled: !checked.length }"
          @click="del"
          >{{ btnText }}</van-button
        >
      </div>
    </div>
    <div class="allCleared" v-else>
      <!-- 扫描失败 -->
      <div class="statusItem">
        <div class="img">
          <img src="@/assets/clearSuccess.png" />
        </div>
        <p class="top">清理完成</p>
        <p class="bottom">已处理完全部的重复文件</p>
        <van-button type="primary" class="normalBtn hoverP" @click="goSelectFile">继续去重</van-button>
      </div>
    </div>
    <van-dialog v-model:show="showDelProgress" title="正在删除中" :showConfirmButton="false" class="delProgress">
      <p class="progressNum">{{ cur_progress }}/{{ total_progress }}</p>
      <van-progress
        :percentage="percentage"
        class="progress"
        :show-pivot="false"
        :color="'linear-gradient(135deg, #EF8881 0%, #DA291C 100%)'"
        :track-color="'rgba(0, 0, 0, 0.02)'"
      />
    </van-dialog>
    <PreviewImg
      v-if="showPreviewImg"
      :showPreviewImg="showPreviewImg"
      @hidePreviewImg="showPreviewImg = false"
      @prewHandleChange="prewHandleChange"
      @changeCurCheckedStatus="changeCurCheckedStatus"
      @deleFiles="delFile"
      :previewTitle="previewTitle"
      :previewItem="previewItem"
      :imgSrc="duplicateData.allThumbnail"
      :btnText="btnText"
      :checkedList="checked"
      :defaultIndex="defaultIndex"
    ></PreviewImg>
  </div>
</template>

<script>
import { reactive, ref, toRefs, onMounted, computed, onBeforeUnmount, watch } from "vue"
import { useRouter } from "vue-router"
import { useStore } from "vuex"
import { convertBytes, shareDateFormat, ellipsis } from "@/utils/index"
import Navbar from "@/components/Navbar"
import PreviewImg from "@/components/PreviewImg"
import * as file_suffix from "@/utils/fileUtil.js"
import Cookies from "js-cookie"
import { deleteFileList, queryRecycleProgress } from "@/api/fileDeduplication"
import { toastmes } from "@/utils/index"
import { Dialog } from "vant"
import useFilePreview from "./useFilePreview"
import useFileSelect from "@/views/Scan/useFileSelect"

export default {
  name: "ClearFiles1",
  props: {},
  components: {
    Navbar,
    PreviewImg,
    useFileSelect,
  },
  setup(props, context) {
    const { attr, slot, emit } = context
    const store = useStore()
    const router = useRouter()
    const showPopover = ref(false)
    let showDelProgress = ref(false)
    const loading = ref(false)
    const finished = ref(false)
    const refreshing = ref(false)
    const state = reactive({
      store,
      convertBytes,
      currentType: "latest",
      shareDateFormat,
      btnText: "删除",
      currentTypeText: "保留最新",
      activeIcon: require("@/assets/selected.svg"),
      inactiveIcon: require("@/assets/un-select.svg"),
      checked: [], //当前选中
      taskId: "", // 删除的taskId
      isAllClear: false, // 是否所有重复项清理完成，（每个子项数量小于等于1）
      timer: null,
      cur_progress: 0,
      total_progress: 0,
      pageNum: 200, //页码
      percentage: 0,
      defaultIndex: 0, //图片预览默认index
      showPreviewImg: false, //图片预览
      previewTitle: "1/1",
      previewItem: {}, //当前图片预览的对象
      actions: [
        { text: "保留最新", type: "latest" },
        { text: "保留最老", type: "oldest" },
        { text: "手动筛选", type: "manual" },
        { text: "最长路径", type: "longest" },
        { text: "最短路径", type: "shortest" },
      ],
    })

    function changeCurCheckedStatus(checked, path) {
      if (checked) {
        state.checked.push(path)
      } else {
        state.checked = state.checked.filter((item) => item !== path)
      }
    }

    //文件预览逻辑
    function previewFile(childItem) {
      let suffix = childItem.name.substr(childItem.name.lastIndexOf(".") + 1)
      suffix = suffix ? suffix.toLowerCase() : suffix
      if (!file_suffix.isVisiable(suffix)) {
        toastmes("当前文件类型不支持预览", "fail")
        return false
      } else {
        // windows桌面端图片预览选择不兼容，内核版本太低
        if (Cookies.get("isDeskApp")) {
          const u = navigator.userAgent
          const agent = u.toLowerCase()
          if (
            agent.indexOf("win32") >= 0 ||
            agent.indexOf("wow32") >= 0 ||
            agent.indexOf("win64") >= 0 ||
            agent.indexOf("wow64") >= 0
          ) {
            const { _nativemes } = useFilePreview(childItem)
            _nativemes(childItem)
            return
          }
        }
        // 图片类型走自定义预览选择逻辑
        if (file_suffix.isImage(suffix)) {
          state.previewItem = childItem
          state.defaultIndex = duplicateData.value.allThumbnail.findIndex((item) => item === childItem.medurl)
          state.previewTitle = `${ellipsis(childItem.name, 10)}(${state.defaultIndex + 1}/${
            duplicateData.value.allThumbnail.length
          })`
          state.showPreviewImg = true
        } else {
          const { _nativemes } = useFilePreview(childItem) //其它文件类型消费
          _nativemes(childItem)
        }
      }
    }

    function prewHandleChange(curMedUrl, curIndex) {
      let fileSetList = duplicateData.value.fileSetList
      for (let i = 0; i < fileSetList.length; i++) {
        state.previewItem = fileSetList[i].find((childItem, childIndex) => childItem.medurl === curMedUrl)
        if (state.previewItem) {
          break
        }
      }
      state.previewTitle = `${ellipsis(state.previewItem.name, 10)}(${curIndex + 1}/${
        duplicateData.value.allThumbnail.length
      })`
    }

    function selectItem(childItem) {
      if (state.checked.includes(childItem.path)) {
        state.checked = state.checked.filter((item) => item !== childItem.path)
        duplicateData.value.selectedTotalCount -= 1
        duplicateData.value.selectedTotalSize -= childItem.size
      } else {
        state.checked.push(childItem.path)
        duplicateData.value.selectedTotalCount += 1
        duplicateData.value.selectedTotalSize += childItem.size
      }
    }
    function goSelectFile() {
      router.push({ path: "selectFile" })
    }
    function del() {
      if (!state.checked.length) {
        return false
      }
      Dialog.confirm({
        title: "确定要删除所选文件？",
        message: `删除的文件可通过回收站还原`,
        className: "scanDialog",
        confirmButtonText: "确认",
        cancelButtonText: "取消",
      }).then(() => {
        state.delFile()
      })
    }

    function delFile() {
      const originalChecked = state.checked.slice(0)
      const deleteChecked = originalChecked.splice(0, 1000) //删除前1000个
      deleteFileList({
        kid: Cookies.get("kid"),
        paths: deleteChecked,
      })
        .then((res) => {
          const { data, error_code } = res
          if (error_code !== 0) {
            toastmes(res.error_msg, "fail")
            return false
          }
          showDelProgress.value = true
          state.total_progress = deleteChecked.length
          state.taskId = data.taskId
          queryRecycle()
        })
        .catch(() => {
          showDelProgress.value = false
        })
    }
    // 查询删除进度
    function queryRecycle() {
      queryRecycleProgress({ taskId: state.taskId })
        .then((res) => {
          const { data, error_code } = res
          if (error_code !== 0) {
            toastmes(res.error_msg, "fail")
          }
          if ([0, 1].includes(data.status)) {
            state.cur_progress = data.cur_progress
            if (data.status !== 0) {
              state.total_progress = data.total_progress
            }
            state.percentage = (state.cur_progress / state.total_progress) * 100
            clearTimeout(state.timer)
            state.timer = setTimeout(() => {
              state.queryRecycle()
            }, 2000)
          } else if (data.status === 2) {
            showDelProgress.value = false
            state.percentage = 0
            toastmes("删除完成", "success")
            let totalCount = 0
            let realCount = 0
            let totalSize = 0
            const deleteChecked = state.checked.splice(0, 1000) //删除前1000个
            let res = []
            duplicateData.value.fileSetList.map((item, index) => {
              // 一组内文件数量小于2的不统计
              if (item.length > 1) {
                // 先过滤掉已删除文件
                item = item.filter((childItem, childIndex) => {
                  if (!deleteChecked.includes(childItem.path)) {
                    return item
                  }
                })
                // 重新统计重复文件组数和总占用空间大小
                if (item.length > 1) {
                  item.map((childItem, childIndex) => {
                    totalSize += childItem.size
                    realCount += 1
                  })
                  totalCount += 1
                }
              }
              if (item.length > 1) {
                res.push(item)
              }
            })
            duplicateData.value.fileSetList = res
            state.isAllClear = !duplicateData.value.fileSetList.find((item) => item.length > 1)
            duplicateData.value.totalCount = totalCount
            duplicateData.value.originalTotalCount = realCount //渲染数组真实节点数量
            duplicateData.value.totalSize = totalSize
            store.commit("selectFile/SET_DUPLICATE_DATA", duplicateData.value)
            const { getDownLoadUrls } = useFileSelect(store)
            getDownLoadUrls(duplicateData.value, () => {
              state.selectChange({ text: "保留最新", type: "latest" }) //默认保留最新
            })
          } else if (data.status === 3) {
            toastmes(res.error_msg, "fail")
          }
        })
        .catch(() => {
          showDelProgress.value = false
        })
    }
    // 快速勾选逻辑
    function selectChange(sortItem) {
      finished.value =
        duplicateData.value.loadedNum >= duplicateData.value.originalTotalCount || duplicateData.value.loadedNum >= 2000
      showPopover.value = false
      state.currentTypeText = sortItem.text
      state.currentType = sortItem.type
      state.checked = []
      let totalSize = 0
      let totalCount = 0
      if (sortItem.type !== "manual") {
        duplicateData.value.fileSetList.forEach((item, index) => {
          let timeSelectRes = []
          if (item.length > 1) {
            item.forEach((childItem, childIndex) => {
              let indexValue = childItem[sortItem.type]
              if (childIndex !== indexValue) {
                timeSelectRes.push(childItem.path)
                totalSize += childItem.size
              }
            })
            totalCount += 1
          }
          state.checked = [...new Set([...state.checked, ...timeSelectRes])]
        })
      }
      duplicateData.value.selectedTotalCount = totalCount
      duplicateData.value.selectedTotalSize = totalSize
    }

    // 手势返回处理
    onMounted(() => {
      if (window.history && window.history.pushState) {
        history.pushState(null, null, document.URL)
        window.addEventListener("popstate", goback, false) //false阻止默认事件
        state.selectChange({ text: "保留最新", type: "latest" }) //默认保留最新
        if (router.currentRoute.value.query.isOverSize == "1") {
          toastmes("重复文件过多，仅展示前2000个重复文件。", "warning")
        }
      }
    })
    onBeforeUnmount(() => {
      window.removeEventListener("popstate", goback, false) //false阻止默认事件
    })
    // 列表数据虚拟分页
    const loadMoreData = () => {
      let dataValue = duplicateData.value
      dataValue.fileSetListCopy = []
      let Num = 0
      let startIndex = 0
      dataValue.loadedStartNum = dataValue.loadedNum
      let k = dataValue.loadedParentIndex //当前展示数组的下标
      // 从已加载的起始位置往后加载1页数据
      for (let i = dataValue.loadedParentIndex; i < dataValue.fileSetList.length; i++) {
        let item = dataValue.fileSetList[i] //源数据
        // 加载下一页需要从当前已加载的下一个开始
        if (dataValue.loadedParentIndex === i) {
          if (dataValue.loadedChildIndex + 1 === item.length) {
            //当前已经加载到了子项的最后一个
            k = k + 1
            continue
          } else {
            startIndex = dataValue.loadedChildIndex === 0 ? 0 : dataValue.loadedChildIndex + 1
          }
        } else {
          startIndex = 0
        }
        for (let j = startIndex; j < item.length; j++) {
          if (Num < state.pageNum) {
            let childItem = item[j]
            dataValue.loadedNum += 1
            Num += 1
            dataValue.loadedChildIndex = j
            if (dataValue.fileSetListCopy[i - k]) {
              dataValue.fileSetListCopy[i - k].push(childItem)
            } else {
              dataValue.fileSetListCopy[i - k] = [childItem]
              dataValue.loadedParentIndex = i
            }
          } else {
            break
          }
        }
        if (Num >= state.pageNum) {
          break
        }
      }

      if (dataValue.loadedNum >= dataValue.originalTotalCount || dataValue.loadedNum >= 2000) {
        finished.value = true
      }
      store.commit("selectFile/SET_DUPLICATE_DATA", dataValue)
      // 加载状态结束
      setTimeout(() => {
        loading.value = false
      }, 10)
    }
    // 访问上一页数据
    const onRefresh = () => {
      // 清空列表数据
      finished.value = false
      let dataValue = duplicateData.value
      let Num = 0
      let startIndex = dataValue.loadedChildIndex
      const prevLength = dataValue.loadedNum - dataValue.loadedStartNum
      // 倒序往前推
      for (let i = dataValue.loadedParentIndex; i >= 0; i--) {
        if (dataValue.loadedParentIndex !== i) {
          startIndex = dataValue.fileSetList[i].length - 1
        }
        for (let j = startIndex; j >= 0; j--) {
          // 加载上一页数据需要拿到当前页数量+一页页码数量 + 1
          if (Num < state.pageNum + prevLength + 1) {
            Num++
            dataValue.loadedParentIndex = i
            dataValue.loadedChildIndex = j
          } else {
            break
          }
        }
        if (Num >= state.pageNum + prevLength) {
          break
        }
      }
      dataValue.loadedNum =
        dataValue.loadedNum - (state.pageNum + prevLength) < 0 ? 0 : dataValue.loadedNum - (state.pageNum + prevLength)
      // 将 loading 设置为 true，表示处于加载状态
      loading.value = true
      store.commit("selectFile/SET_DUPLICATE_DATA", dataValue)
      loadMoreData()
    }
    const router = useRouter()
    const goback = () => {
      if (showDelProgress.value) {
        history.pushState(null, null, document.URL)
      } else {
        router.push({ path: "index", query: { reGetStatus: 1 } })
      }
    }

    // 扫描出的重复文件信息
    const duplicateData = computed(() => {
      return store.getters.duplicateData
    })
    const getActiveStatus = (parentItem) => {
      if (!parentItem || !parentItem[0]) {
        return ""
      }
      const index = parentItem[0].parentIndex
      const realParentItem = duplicateData.value.fileSetList[index]
      return !realParentItem.find((item) => !state.checked.includes(item.path))
    }

    watch(
      () => state.checked,
      (newValue, oldValue) => {
        let totalSize = 0
        duplicateData.value.fileSetList.forEach((item, index) => {
          item.forEach((childItem) => {
            if (newValue.includes(childItem.path)) {
              totalSize += childItem.size
            }
          })
        })
        state.btnText = newValue.length ? `删除（${newValue.length}个/${state.convertBytes(totalSize)}）` : "删除"
      },
      { deep: true }
    )
  },
}
</script>

<style lang="less" scoped>
.clearFiles-content {
  height: 100vh;
  background: #fafafa;
  display: flex;
  flex-direction: column;
  .header {
    height: 57px;
    position: relative;
    .popoverContent {
      height: 24px;
      position: absolute;
      right: 20px;
      top: 25px;
      display: flex;
      align-items: center;
      cursor: pointer;
      :deep(.van-popover__wrapper) {
        display: flex;
        align-items: center;
      }
      .img {
        width: 12px;
        height: 12px;
      }
      .text {
        margin-left: 6px;
        font-size: 11px;
        color: #303133;
      }
    }
  }
  .content {
    flex: 1;
    overflow-y: scroll;
    display: flex;
    flex-direction: column;
    background: #fafafa;
    &::-webkit-scrollbar {
      display: none;
    }
    .fixHeader {
      width: 345px;
      height: 40px;
      min-height: 40px;
      margin: 12px 15px 10px 15px;
      padding: 10px;
      box-sizing: border-box;
      background: #fdf6ec;
      border-radius: 8px;
      border: 1px solid #e6a23c;
      display: flex;
      align-items: center;
      font-size: 13px;
      color: #e6a23c;
      .img {
        width: 16px;
        height: 16px;
      }
      .info {
        padding-left: 10px;
      }
    }
    .wrap {
      flex: 1;
      overflow-x: hidden;
      overflow-y: scroll;
      background: rgba(0, 0, 0, 0.03);
      :deep(.van-pull-refresh__head) {
        display: none;
      }
      .loadingStatus {
        margin-top: 15px;
        font-size: 15px;
        line-height: 22px;
        text-align: center;
        color: #909399;
      }
      &::-webkit-scrollbar {
        display: none;
      }
      .parentList {
        padding: 10px 0;
        border-bottom: 20px solid #fafafa;
        &.empty {
          display: none;
        }
        &.active {
          background: #fff7f6;
        }
        &:last-child {
          border-bottom: none;
        }
        .childList {
          width: 100%;
          overflow: hidden;
          margin-bottom: 10px;
          display: flex;
          .childListLeft {
            flex: 0 0 36px;
            padding: 26px 0 0 15px;
            .img-icon {
              width: 16px;
              height: 16px;
            }
          }
          .childListRight {
            width: 339px;
            padding: 10px 4px 5px 10px;
            background: #fff;
            box-sizing: border-box;
            border-radius: 8px;
            .childTop {
              display: flex;
              border-bottom: 1px solid #f2f6fc;
              padding-bottom: 5px;
              .childTopLeft {
                flex: 0 0 50px;
                padding: 10px 0 0 10px;
                &.paddingLeftNone {
                  padding-left: 0;
                }
                .img {
                  width: 40px;
                  height: 40px;
                  border-radius: 6px;
                  overflow: hidden;
                  .vedio {
                    display: inline-block;
                    width: 40px;
                    height: 40px;
                    position: relative;
                    .playBtn {
                      width: 34px;
                      height: 34px;
                      position: absolute;
                      left: 3px;
                      top: 3px;
                      z-index: 1;
                    }
                  }
                }
                .svgIcon {
                  width: 20px;
                  height: 20px;
                }
              }
              .childTopRight {
                width: 275px;
                .name {
                  line-height: 40px;
                  color: #303133;
                  font-size: 13px;
                  margin-bottom: 5px;
                }
                .info {
                  display: flex;
                  justify-content: space-between;
                  font-size: 11px;
                  color: #909399;
                  line-height: 16px;
                }
              }
            }
            .childBottom {
              margin-top: 4px;
              word-break: break-all;
              font-size: 11px;
              color: #909399;
              line-height: 16px;
            }
          }
        }
      }
    }
    .footer {
      flex-shrink: 0;
      width: 100%;
      height: 88px;
      position: relative;
      box-sizing: border-box;
      display: flex;
      justify-content: center;
      padding: 10px 54px 0 54px;
      background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, #ffffff 100%);
      box-shadow: 0px 0px 32px 0px rgba(218, 41, 28, 0.2);
      border-radius: 32px 32px 0px 0px;
      .footerBtn {
        width: 267px;
        height: 38px;
        border-radius: 12px;
        font-size: 13px;
        background: #d0d0ce;
        color: #303133;
        text-shadow: 0px 0px 32px rgba(218, 41, 28, 0.2);
        &.active {
          background: linear-gradient(135deg, #ef8881 0%, #da291c 100%);
          color: #ffffff;
          text-shadow: 0px 0px 32px rgba(218, 41, 28, 0.2);
        }
      }
    }
  }
  .allCleared {
    padding-top: 114px;
    .statusItem {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      .img {
        width: 187px;
        height: 187px;
      }
      .top {
        margin: 30px 0 15px;
        height: 24px;
        font-size: 17px;
        font-weight: 500;
        color: #67c23a;
        line-height: 24px;
      }
      .bottom {
        margin-bottom: 91px;
        color: #909399;
        line-height: 22px;
        font-size: 15px;
      }
      .normalBtn {
        width: 135px;
      }
    }
  }
  .delProgress {
    .progressNum {
      font-size: 13px;
      color: #909399;
      line-height: 20px;
      margin: 10px 0;
      text-align: center;
    }
  }
}
</style>
<style lang="less">
.clearFilesPopover {
  width: 121px;
  .van-popover__content {
    margin-top: 4px;
    padding: 0 4px;
    box-sizing: border-box;
    .popoverItems {
      height: 44px;
      line-height: 44px;
      text-align: center;
      width: 113px;
      margin: 4px 0;
      box-sizing: border-box;
      border-bottom: 1px solid #fafafa;
      background: #fff;
      font-size: 13px;
      color: #303133;
      &:last-child {
        border-bottom: none;
      }
      &.active {
        background: #fff7f6;
        border-radius: 4px;
      }
    }
  }
}
.fileDeduplication .scanDialog {
  .van-button {
    width: 100px;
  }
  .van-dialog__cancel {
    background: #fff;
    border-radius: 12px !important;
    border: 1px solid #d0d0ce;
    color: #909399;
    font-size: 13px;
  }
  .van-dialog__confirm {
    border-radius: 12px !important;
  }
}
</style>
